<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <meta name="description" content="Fancy Sliding Form with jQuery" />
        <meta name="keywords" content="jquery, form, sliding, usability, css3, validation, javascript"/>
        <link rel="stylesheet" href="../../assets/css/style.css" type="text/css" media="screen"/>
        <link rel="stylesheet" href="../../assets/css/main.css" type="text/css" media="screen"/>

        <link rel="stylesheet" href="../../assets/css/validationEngine.jquery.css" type="text/css"/>

        <script type="text/javascript" src="../../js/jquery-1.7.1.js"></script>
		<script src="../../js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8">
		</script>
		<script src="../../js/jquery.validationEngine.js" type="text/javascript" charset="utf-8">
		</script>
		<script type="text/javascript" src="js/sliding.form.js"></script>
		<script>
		jQuery(document).ready(function(){
			// binds form submission and fields to the validation engine
			jQuery("#addInstitute").validationEngine();
		});

		
		
	</script>
    </head>
    <body>
       <div id="content">
            <h1>Add Institute Form</h1>
            <div id="wrapper">
                <div id="steps">
                    <form id="addInstitute" name="formElem" action="" method="post">
                        <fieldset class="step">
                            <legend>Institute</legend>
                             <p>
                             	<label for="instName">Name</label>
                             	<input value="" class="validate[required] text-input" type="text" name="req" id="name" />
                             </p>
                             <p>
                             	<label for="instCode">Code</label>
								<input value="" class="validate[required] text-input" type="text" name="req" id="code" />
                             </p>
                             <p>
                             	<label for="instAddress1">Address Line 1</label>
								<input value="" class="validate[required] text-input" type="text" name="req" id="addLine2" />
                             </p>
 							 <p>
                             	<label for="instAddress2">Address Line 2</label>
								<input value="" type="text" name="req" id="addLine2" />
                             </p>
                             <p>
                             	<label for="instAddress3">Address Line 3</label>
								<input value="" type="text" name="req" id="addLine3" />
                             </p>
                             <p>
                             	<label for="instCity">City</label>
								<input value="" class="validate[required] text-input" type="text" name="req" id="city" />
                             </p>
                             <p>
                             	<label for="instState">State</label>
								<input value="" class="validate[required] text-input" type="text" name="req" id="state" />
                             </p>
                             <p>
                             	<label for="instCountry">Country</label>
								<input value="" class="validate[required] text-input" type="text" name="req" id="state" />
                             </p>
                             <p>
                             	<label for="instPhone1">Phone1</label>
								<input value="" class="validate[required, custom[phone]] text-input" type="text" name="req" id="phone1" />
                             </p>
                             <p>
                             	<label for="instPhone2">Phone2</label>
								<input value="" class="validate[custom[phone]] text-input" type="text" name="req" id="phone1" />
                             </p>
                              <p>
                             	<label for="instWeb">Website</label>
								<input value="" class="validate[required,custom[url]] text-input" type="text" name="req" id="website" />
                             </p>
                             <p>
                             	<label for="instParent">Parent Institute</label>
								<input value="" class="validate[required,custom[url]] text-input" type="text" name="req" id="website" />
                             </p>
                      	</fieldset>
                      	<button type="submit">Submit</button>
                      </form>
                </div>
            </div>
        </div>
    </body>
</html>